<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	
	<body>
		<h3>javaScript访问DOM树案列</h3>
		
		<a href="http://www.taobao.com" target="_blank">淘宝</a>
		<a class="bd" href="http://www.baidu.com" target="_blank">百度</a>
		<a name="pdd" href="http://www.pingduoduo.com" target="_blank">拼多多</a>
		<a id="cgb" href="http://act.codeboy.com" target="_blank">java培优</a>
	
	<script> 
		//window.alert('使用js获取页面元素内容');//BOM中提供弹出框API
		//window.alert(document.getElementsByTagName('a')[0]);//得到页面上所有的a元素
		//alert(document.getElementsByTagName('a')[0].innerText);
		
		//方式1：tagname
		console.log(document.getElementsByTagName('a')[0].innerText);
		console.log(document.getElementsByTagName('a')[0].href);
		
		//方式2：classname
		console.log(document.getElementsByClassName('bd')[0].innerText);
		console.log(document.getElementsByClassName('bd')[0].href);
		
		//方式3：name
		console.log(document.getElementsByName('pdd')[0].innerText);
		console.log(document.getElementsByName('pdd')[0].href);
		
		//方式4：id
		console.log(document.getElementById('cgb').innerText);
		console.log(document.getElementById('cgb').href);
		
		//淘宝改成天猫
		//document.getElementsByTagName("a")[0].innerText = "天猫"；
		//document.getElementsByTagName("a")[0].href = "http://www.tianmao.com"；
		
		//定义变量a,后面操作a
		var a = document.getElementsByTagName("a")[0];
		a.innerText = "天猫";
		a.href = "http://www.tianmao.com";
		
	</script>
	</body>
</html>
